<template>
  <div>
    <van-nav-bar title="我的地址" left-arrow @click-left="onClickLeft" />
    <ul>
      <li v-for="item in list" class="dizhi">
        <p>姓名:{{item.a}}</p>

        <p>手机号:{{item.b}}</p>

        <p>地址:{{item.c}}</p>

        <p>邮编:{{item.d}}</p>
        <button @click="del()">删除</button>
        <hr />
      </li>
    </ul>
    <button
      @click="btn()"
      style="background:red;width:100%;height:1.5rem;position:absolute;bottom:0;font-size:.4rem"
    >新增地址</button>
  </div>
</template>


<script>
import { Toast } from "vant";
export default {
  data() {
    return {
      list: []
    };
  },

  methods: {
    onClickLeft() {
      this.$router.go(-1);
    },
    btn() {
      this.$router.push("/addadres");
    },
    del() {
      this.list.splice(this.$data.i, 1);
      localStorage.setItem('adres',JSON.stringify(this.list))
    }
  },
  mounted() {
    var b1 = JSON.parse(localStorage.getItem("adres"));
    this.list = b1;
  }
};
</script>
<style scoped>
* {
  margin: 0;
  padding: 0;
}
p {
  margin-bottom: 0.1rem;
}
dizhi{
 width:100%;
 padding:0 .15rem;
 margin:.2rem 0;
}
</style>

